<!--<!DOCTYPE html>-->
<!--<html lang="zh-CN">-->
<!--<head>-->
<!--    <meta charset="UTF-8">-->
<!--    <title>帮助文档</title>-->
<!--    <style>-->
<!--        body {-->
<!--            font-family: Arial, sans-serif;-->
<!--            background-color: #f4f4f4;-->
<!--            margin: 0;-->
<!--            padding: 0;-->
<!--            display: flex;-->
<!--            justify-content: center;-->
<!--            align-items: flex-start;-->
<!--            min-height: 100vh;-->
<!--            padding: 20px;-->
<!--            box-sizing: border-box;-->
<!--        }-->

<!--        .container {-->
<!--            background-color: #fff;-->
<!--            border-radius: 8px;-->
<!--            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);-->
<!--            padding: 20px;-->
<!--            width: 100%;-->
<!--            max-width: 800px;-->
<!--            text-align: left;-->
<!--        }-->

<!--        h2 {-->
<!--            margin-bottom: 20px;-->
<!--            color: #333;-->
<!--            text-align: center;-->
<!--        }-->

<!--        .search-bar {-->
<!--            margin-bottom: 20px;-->
<!--            display: flex;-->
<!--            justify-content: center;-->
<!--        }-->

<!--        input[type="text"] {-->
<!--            width: 80%;-->
<!--            padding: 10px;-->
<!--            border: 1px solid #ccc;-->
<!--            border-radius: 4px;-->
<!--            margin-right: 10px;-->
<!--        }-->

<!--        button {-->
<!--            padding: 10px;-->
<!--            background-color: #4CAF50;-->
<!--            color: white;-->
<!--            border: none;-->
<!--            border-radius: 4px;-->
<!--            cursor: pointer;-->
<!--        }-->

<!--        button:hover {-->
<!--            background-color: #45a049;-->
<!--        }-->

<!--        .document {-->
<!--            border-bottom: 1px solid #ccc;-->
<!--            padding: 10px 0;-->
<!--            margin-bottom: 10px;-->
<!--        }-->

<!--        .document:last-child {-->
<!--            border-bottom: none;-->
<!--        }-->

<!--        .document h3 {-->
<!--            margin: 0;-->
<!--            font-size: 18px;-->
<!--            color: #007BFF;-->
<!--        }-->

<!--        .document p {-->
<!--            margin: 5px 0 0;-->
<!--            color: #555;-->
<!--        }-->

<!--        a {-->
<!--            text-decoration: none;-->
<!--            color: #007BFF;-->
<!--        }-->

<!--        a:hover {-->
<!--            text-decoration: underline;-->
<!--        }-->

<!--        .image-steps {-->
<!--            margin-top: 20px;-->
<!--        }-->

<!--        .image-step {-->
<!--            margin-bottom: 10px;-->
<!--        }-->

<!--        .image-step img {-->
<!--            max-width: 100%;-->
<!--            border-radius: 4px;-->
<!--        }-->
<!--    </style>-->
<!--    <script>-->
<!--        function searchDocuments() {-->
<!--            const input = document.getElementById('searchInput');-->
<!--            const filter = input.value.toLowerCase();-->
<!--            const documents = document.getElementsByClassName('document');-->

<!--            for (let i = 0; i < documents.length; i++) {-->
<!--                const title = documents[i].getElementsByTagName('h3')[0].innerText;-->
<!--                const description = documents[i].getElementsByTagName('p')[0].innerText;-->
<!--                if (title.toLowerCase().indexOf(filter) > -1 || description.toLowerCase().indexOf(filter) > -1) {-->
<!--                    documents[i].style.display = '';-->
<!--                } else {-->
<!--                    documents[i].style.display = 'none';-->
<!--                }-->
<!--            }-->
<!--        }-->
<!--    </script>-->
<!--</head>-->
<!--<body>-->
<!--    <div class="container">-->
<!--        <h2>帮助文档</h2>-->
<!--        <div class="search-bar">-->
<!--            <input type="text" id="searchInput" placeholder="搜索帮助文档..." onkeyup="searchDocuments()">-->
<!--            <button onclick="searchDocuments()">搜索</button>-->
<!--        </div>-->

<!--        <h3>系统使用指南</h3>-->
<!--        {% for document in documents %}-->
<!--            <div class="document">-->
<!--                <h3><a href="{{ document.get_absolute_url }}">{{ document.title }}</a></h3>-->
<!--                <p>{{ document.description }}</p>-->
<!--            </div>-->
<!--        {% empty %}-->
<!--            <p>暂无帮助文档。</p>-->
<!--        {% endfor %}-->

<!--        <h3>常见问题解答 (FAQ)</h3>-->
<!--        <div class="faq">-->
<!--            <div class="document">-->
<!--                <h3><a href="#">如何重置密码？</a></h3>-->
<!--                <p>您可以通过点击“忘记密码”链接来重置您的密码。</p>-->
<!--            </div>-->
<!--            <div class="document">-->
<!--                <h3><a href="#">如何联系支持团队？</a></h3>-->
<!--                <p>您可以通过电子邮件或电话联系支持团队，我们会尽快回复您。</p>-->
<!--            </div>-->
<!--            &lt;!&ndash; 更多常见问题 &ndash;&gt;-->
<!--        </div>-->

<!--        <h3>操作步骤示例</h3>-->
<!--        <div class="image-steps">-->
<!--            <div class="image-step">-->
<!--                <img src="/static/img/img1.png" alt="步骤1">-->
<!--                <p>步骤 1: 描述步骤 1 的内容。</p>-->
<!--            </div>-->
<!--            <div class="image-step">-->
<!--                <img src="/static/img/img2.png" alt="步骤2">-->
<!--                <p>步骤 2: 描述步骤 2 的内容。</p>-->
<!--            </div>-->
<!--            &lt;!&ndash; 更多步骤 &ndash;&gt;-->
<!--        </div>-->
<!--    </div>-->
<!--</body>-->
<!--</html>-->

<!--<!DOCTYPE html>-->
<!--<html lang="zh-CN">-->
<!--{% load static %}-->
<!--<head>-->
<!--    <meta charset="UTF-8">-->
<!--    <title>帮助文档</title>-->
<!--    <style>-->
<!--        body {-->
<!--            font-family: Arial, sans-serif;-->
<!--            background-color: #f8f8f8;-->
<!--            color: #333;-->
<!--            margin: 0;-->
<!--            padding: 20px;-->
<!--        }-->

<!--        header, main {-->
<!--            max-width: 800px;-->
<!--            margin: auto;-->
<!--        }-->

<!--        h1 {-->
<!--            text-align: center;-->
<!--            margin-bottom: 20px;-->
<!--            color: #444;-->
<!--        }-->

<!--        h2 {-->
<!--            color: #555;-->
<!--            margin-top: 20px;-->
<!--        }-->

<!--        p {-->
<!--            font-size: 16px;-->
<!--            line-height: 1.5;-->
<!--            margin: 10px 0;-->
<!--        }-->

<!--        .search-bar {-->
<!--            margin-bottom: 20px;-->
<!--            text-align: center;-->
<!--        }-->

<!--        input {-->
<!--            width: 80%;-->
<!--            padding: 10px;-->
<!--            font-size: 16px;-->
<!--            border: 1px solid #ccc;-->
<!--            border-radius: 4px;-->
<!--        }-->

<!--        .faq {-->
<!--            margin: 20px 0;-->
<!--        }-->

<!--        .faq-item {-->
<!--            margin-bottom: 10px;-->
<!--        }-->

<!--        .faq-question {-->
<!--            font-weight: bold;-->
<!--            margin: 5px 0;-->
<!--        }-->

<!--        .faq-answer {-->
<!--            margin-left: 20px;-->
<!--        }-->

<!--        img {-->
<!--            max-width: 100%;-->
<!--            display: block;-->
<!--            margin: 20px auto;-->
<!--            border-radius: 8px;-->
<!--            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);-->
<!--        }-->

<!--        a {-->
<!--            margin-top: 20px;-->
<!--            display: inline-block;-->
<!--            background-color: #007bff;-->
<!--            color: white;-->
<!--            padding: 10px 15px;-->
<!--            text-decoration: none;-->
<!--            border-radius: 4px;-->
<!--            transition: background-color 0.3s;-->
<!--        }-->

<!--        a:hover {-->
<!--            background-color: #0056b3;-->
<!--        }-->
<!--    </style>-->
<!--</head>-->
<!--<body>-->
<!--    <header>-->
<!--        <h1>帮助文档</h1>-->
<!--    </header>-->
<!--    <main>-->
<!--        <div class="search-bar">-->
<!--            <h2>搜索帮助文档</h2>-->
<!--            <input type="text" id="searchInput" placeholder="输入关键词进行搜索..." onkeyup="filterDocuments()">-->
<!--        </div>-->

<!--        <h2>系统使用指南</h2>-->
<!--        <p>本文档为您提供系统的使用指南，您可以通过上方的搜索框快速查找特定内容。</p>-->
<!--        <ul id="documentsList">-->
<!--            {% for document in documents %}-->
<!--                <li><a href="{{ document.url }}">{{ document.title }}</a></li>-->
<!--            {% endfor %}-->
<!--        </ul>-->

<!--        <h2>常见问题解答（FAQ）</h2>-->
<!--        <div class="faq">-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">1. 如何使用分词功能？</div>-->
<!--                <div class="faq-answer">请在主页上输入您需要分词的文本，然后点击“分词”按钮。</div>-->
<!--            </div>-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">2. 如何注册新用户？</div>-->
<!--                <div class="faq-answer">点击主页上的“注册”链接，填写相关信息进行注册。</div>-->
<!--            </div>-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">3. 我可以上传文件吗？</div>-->
<!--                <div class="faq-answer">目前只能手动输入文本，暂不支持文件上传功能。</div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <h2>操作步骤示例</h2>-->
<!--&lt;!&ndash;        <img src="{% static '/static/img/img1.png' %}" alt="操作步骤1">&ndash;&gt;-->
<!--&lt;!&ndash;        <img src="{% static '/static/img/img2.png' %}" alt="操作步骤2">&ndash;&gt;-->
<!--&lt;!&ndash;        <img src="{% static '/static/img/img3.png' %}" alt="操作步骤3">&ndash;&gt;-->
<!--        <p>第一步：</p>-->
<!--        <p>第二部：</p>-->
<!--        <p>第三步：</p>-->
<!--    </main>-->

<!--    <script>-->
<!--        function filterDocuments() {-->
<!--            const input = document.getElementById('searchInput');-->
<!--            const filter = input.value.toLowerCase();-->
<!--            const ul = document.getElementById('documentsList');-->
<!--            const li = ul.getElementsByTagName('li');-->

<!--            for (let i = 0; i < li.length; i++) {-->
<!--                const a = li[i].getElementsByTagName('a')[0];-->
<!--                if (a) {-->
<!--                    const txtValue = a.textContent || a.innerText;-->
<!--                    li[i].style.display = txtValue.toLowerCase().indexOf(filter) > -1 ? "" : "none";-->
<!--                }-->
<!--            }-->
<!--        }-->
<!--    </script>-->
<!--</body>-->
<!--</html>-->

<!--<!DOCTYPE html>-->
<!--<html lang="zh-CN">-->
<!--{% load static %}-->
<!--<head>-->
<!--    <meta charset="UTF-8">-->
<!--    <title>帮助文档</title>-->
<!--    <style>-->
<!--        body {-->
<!--            font-family: Arial, sans-serif;-->
<!--            background-color: #f8f8f8;-->
<!--            color: #333;-->
<!--            margin: 0;-->
<!--            padding: 20px;-->
<!--        }-->

<!--        header, main {-->
<!--            max-width: 800px;-->
<!--            margin: auto;-->
<!--        }-->

<!--        h1 {-->
<!--            text-align: center;-->
<!--            margin-bottom: 20px;-->
<!--            color: #444;-->
<!--        }-->

<!--        h2 {-->
<!--            color: #555;-->
<!--            margin-top: 20px;-->
<!--            text-decoration: underline; /* 新增下划线 */-->
<!--        }-->

<!--        p {-->
<!--            font-size: 16px;-->
<!--            line-height: 1.5;-->
<!--            margin: 10px 0;-->
<!--        }-->

<!--        .search-bar {-->
<!--            margin-bottom: 20px;-->
<!--            text-align: center;-->
<!--        }-->

<!--        input {-->
<!--            width: 80%;-->
<!--            padding: 10px;-->
<!--            font-size: 16px;-->
<!--            border: 1px solid #ccc;-->
<!--            border-radius: 4px;-->
<!--            transition: border-color 0.3s; /* 新增过渡效果 */-->
<!--        }-->

<!--        input:focus {-->
<!--            border-color: #007bff; /* 聚焦时边框颜色变化 */-->
<!--        }-->

<!--        .faq {-->
<!--            margin: 20px 0;-->
<!--        }-->

<!--        .faq-item {-->
<!--            margin-bottom: 10px;-->
<!--            padding: 10px;-->
<!--            border: 1px solid #ddd;-->
<!--            border-radius: 4px;-->
<!--            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);-->
<!--        }-->

<!--        .faq-question {-->
<!--            font-weight: bold;-->
<!--            margin: 5px 0;-->
<!--            cursor: pointer; /* 鼠标悬停时显示为手型 */-->
<!--        }-->

<!--        .faq-answer {-->
<!--            margin-left: 20px;-->
<!--            padding-left: 10px;-->
<!--            border-left: 2px solid #007bff; /* 左侧边框 */-->
<!--        }-->

<!--        img {-->
<!--            max-width: 100%;-->
<!--            display: block;-->
<!--            margin: 20px auto;-->
<!--            border-radius: 8px;-->
<!--            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);-->
<!--        }-->

<!--        a {-->
<!--            margin-top: 20px;-->
<!--            display: inline-block;-->
<!--            background-color: #007bff;-->
<!--            color: white;-->
<!--            padding: 10px 15px;-->
<!--            text-decoration: none;-->
<!--            border-radius: 4px;-->
<!--            transition: background-color 0.3s;-->
<!--        }-->

<!--        a:hover {-->
<!--            background-color: #0056b3;-->
<!--        }-->

<!--        /* 新增样式 */-->
<!--        .step-section {-->
<!--            margin-top: 20px;-->
<!--        }-->

<!--        .step-title {-->
<!--            font-size: 18px;-->
<!--            font-weight: bold;-->
<!--            margin-bottom: 10px;-->
<!--        }-->

<!--        .step-content {-->
<!--            margin-bottom: 20px;-->
<!--        }-->

<!--        .step-image {-->
<!--            text-align: center;-->
<!--        }-->
<!--    </style>-->
<!--</head>-->
<!--<body>-->
<!--    <header>-->
<!--        <h1>帮助文档</h1>-->
<!--    </header>-->
<!--    <main>-->
<!--        <div class="search-bar">-->
<!--            <h2>搜索帮助文档</h2>-->
<!--            <input type="text" id="searchInput" placeholder="输入关键词进行搜索..." onkeyup="filterDocuments()">-->
<!--        </div>-->

<!--        <h2>系统使用指南</h2>-->
<!--        <p>本文档为您提供系统的使用指南，您可以通过上方的搜索框快速查找特定内容。</p>-->
<!--        <ul id="documentsList">-->
<!--            {% for document in documents %}-->
<!--                <li><a href="{{ document.url }}">{{ document.title }}</a></li>-->
<!--            {% endfor %}-->
<!--        </ul>-->

<!--        <h2>常见问题解答（FAQ）</h2>-->
<!--        <div class="faq">-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">1. 如何使用分词功能？</div>-->
<!--                <div class="faq-answer">请在主页上输入您需要分词的文本，然后点击“分词”按钮。</div>-->
<!--            </div>-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">2. 如何注册新用户？</div>-->
<!--                <div class="faq-answer">点击主页上的“注册”链接，填写相关信息进行注册。</div>-->
<!--            </div>-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">3. 我可以上传文件吗？</div>-->
<!--                <div class="faq-answer">目前只能手动输入文本，暂不支持文件上传功能。</div>-->
<!--            </div>-->
<!--            <div class="faq-item">-->
<!--                <div class="faq-question">4. 系统支持哪些语言？</div>-->
<!--                <div class="faq-answer">目前系统支持中文和英文。</div>-->
<!--            </div>-->
<!--        </div>-->

<!--        <h2>操作步骤示例</h2>-->
<!--        <div class="step-section">-->
<!--            <div class="step-title">第一步：登录系统</div>-->
<!--            <div class="step-content">-->
<!--                <p>在浏览器中输入系统地址，点击“登录”按钮，输入您的用户名和密码进行登录。</p>-->
<!--            </div>-->
<!--            <div class="step-image">-->
<!--                <img src="{% static 'img/img1.jpg' %}" alt="登录步骤">-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="step-section">-->
<!--            <div class="step-title">第二步：进入分词页面</div>-->
<!--            <div class="step-content">-->
<!--                <p>登录后，根据分词需求，点击上面菜单栏中的各种分词功能，进入各个分词页面。</p>-->
<!--            </div>-->
<!--            <div class="step-image">-->
<!--                <img src="{% static 'img/img2.jpg' %}" alt="创建项目步骤">-->
<!--            </div>-->
<!--        </div>-->
<!--        <div class="step-section">-->
<!--            <div class="step-title">第三步：输入数据或中文文本</div>-->
<!--            <div class="step-content">-->
<!--                <p>在项目详情页，输入需要处理的数据或中文文本，点击“开始分析”或者“分词”按钮。。</p>-->
<!--            </div>-->
<!--            <div class="step-image">-->
<!--                <img src="{% static 'img/img3.jpg' %}" alt="上传数据步骤">-->
<!--            </div>-->
<!--        </div>-->
<!--    </main>-->

<!--    <script>-->
<!--        function filterDocuments() {-->
<!--            const input = document.getElementById('searchInput');-->
<!--            const filter = input.value.toLowerCase();-->
<!--            const ul = document.getElementById('documentsList');-->
<!--            const li = ul.getElementsByTagName('li');-->

<!--            for (let i = 0; i < li.length; i++) {-->
<!--                const a = li[i].getElementsByTagName('a')[0];-->
<!--                if (a) {-->
<!--                    const txtValue = a.textContent || a.innerText;-->
<!--                    li[i].style.display = txtValue.toLowerCase().indexOf(filter) > -1 ? "" : "none";-->
<!--                }-->
<!--            }-->
<!--        }-->
<!--    </script>-->
<!--</body>-->
<!--</html>-->

<!DOCTYPE html>
<html lang="zh-CN">
{% load static %}
<head>
    <meta charset="UTF-8">
    <title>帮助文档</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #e6f7ff ; /* 浅蓝色背景 */
            color: #000080 ;
            margin: 0;
            padding: 20px;
        }

        header, main {
            max-width: 1100px;
            margin: auto;
            background-color: white; /* 主内容区域白色背景 */
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
        }

        h1 {
            text-align: center;
            margin-bottom: 20px;
            color: #191970 ;
        }

        h2 {
            color: #191970;
            text-align: center;
            margin-top: 40px;
            text-decoration: underline; /* 新增下划线 */
            font-size: 28px;
        }

         h3 {
            color: #191970;
            margin-top: 20px;
            font-size: 22px;
        }

         h4 {
            color: #191970;
            margin-top: 20px;
            font-size: 24px;
            text-decoration: underline; /* 新增下划线 */
        }

        p {
            font-size: 16px;
            line-height: 1.5;
            margin: 10px 0;
        }

        .search-bar {
            margin-bottom: 20px;
            text-align: center;
        }

        input {
            width: 80%;
            padding: 10px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 4px;
            transition: border-color 0.3s; /* 新增过渡效果 */
        }

        input:focus {
            border-color: #007bff; /* 聚焦时边框颜色变化 */
        }

        .faq {
            margin: 20px 0;
        }

        .faq-item {
            margin-bottom: 10px;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        .faq-question {
            font-weight: bold;
            margin: 5px 0;
            cursor: pointer; /* 鼠标悬停时显示为手型 */
        }

        .faq-answer {
            margin-left: 20px;
            padding-left: 10px;
            border-left: 2px solid #007bff; /* 左侧边框 */
            color: black; /* 调整文本颜色 */
        }

        img {
            max-width: 100%;
            display: block;
            margin: 20px auto;
            border-radius: 8px;
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        }

        a {
            margin-top: 20px;
            display: inline-block;
            background-color: #007bff;
            color: white;
            padding: 10px 15px;
            text-decoration: none;
            border-radius: 4px;
            transition: background-color 0.3s;
        }

        a:hover {
            background-color: #0056b3;
        }

        /* 新增样式 */
        .step-section {
            margin-top: 20px;
        }

        .step-title {
            font-size: 18px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .step-content {
            margin-bottom: 20px;
        }

        .step-image {
            text-align: center;
        }

         /* 保留现有的样式，新增以下样式 */
        .feedback-form {
            margin-top: 30px;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 8px;
            background-color: #f9f9f9;
        }
        .feedback-form textarea {
            width: 100%;
            padding: 10px;
            margin-bottom: 10px;
            border: 1px solid #ccc;
            border-radius: 4px;
        }
        .feedback-form button {
            padding: 10px 15px;
            background-color: #007bff;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        .feedback-form button:hover {
            background-color: #0056b3;
        }

        .alert {
        background-color: #d4edda;
        color: #155724;
        padding: 15px;
        margin-bottom: 20px;
        border: 1px solid #c3e6cb;
        border-radius: 5px;
    }
    </style>
</head>
<body>
    <header>
        <h1>帮助文档</h1>
    </header>
    <main>

        <h4>系统使用指南</h4>
        <p>本文档为您提供系统的使用指南。</p>


        <h2>常见问题解答（FAQ）</h2>
        <div class="faq">
            <div class="faq-item">
                <div class="faq-question">Q1：如何使用分词功能？</div>
                <div class="faq-answer">请在主页上输入您需要分词的文本，然后点击“分词”按钮。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q2：如何注册新用户？</div>
                <div class="faq-answer">点击主页上的“注册”链接，填写相关信息进行注册。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q3：我可以上传文件吗？</div>
                <div class="faq-answer">目前只能手动输入文本，暂不支持文件上传功能。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q4：系统支持哪些语言？</div>
                <div class="faq-answer">目前系统支持中文和英文。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q5：如何修改输入的文本？</div>
                <div class="faq-answer">只需在文本框中编辑或替换内容，然后点击相应功能按钮，系统将重新生成结果。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q6：如何调整生成的摘要的长度？</div>
                <div class="faq-answer">通过修改“摘要句子数量”输入框中的数字，您可以选择生成更简洁或更详细的摘要。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q7：文本有字数限制吗？</div>
                <div class="faq-answer">虽然没有严格的字数限制，但建议输入文本的长度适中，以保证生成结果的准确性和效率。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">Q8：生成的摘要与预期不符怎么办？</div>
                <div class="faq-answer">自动摘要基于算法分析生成，可能会受输入文本结构和内容的影响。如果结果不理想，可以尝试修改文本或调整摘要句子数量。</div>
            </div>
        </div>

        <hr>

        <h2>特殊功能介绍</h2>
        <h3>自动摘要功能</h3>
        <div class="faq">
            <div class="faq-item">
                <div class="faq-question">1. 目的</div>
                <div class="faq-answer">自动摘要功能能够帮助用户从一段文本中提取出最重要的内容，生成简洁的摘要。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question">2. 具体如何使用呢？</div>
                <div class="faq-answer"> - 修改或输入文本：在文本框中，您可以修改或输入希望进行摘要的中文文本。</div>
                <div class="faq-answer"> - 设置摘要句子数量：在“摘要句子数量”输入框中，选择希望摘要包含的条目数（默认为5）。您可以根据需要调整该数值。</div>
                <div class="faq-answer"> - 点击“摘要”按钮：点击按钮后，系统会自动分析并返回摘要结果。</div>
                <div class="faq-answer"> - 查看结果：在页面下方，您将看到根据输入文本生成的摘要。</div>
            </div>
        </div>

        <hr>

        <h3>关键词提取功能</h3>
        <div class="faq">
            <div class="faq-item">
                <div class="faq-question"> 1. 目的</div>
                <div class="faq-answer">关键词提取功能能从文本中提取出最重要的关键词，帮助您快速抓取文本核心信息。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question"> 2. 具体如何使用呢？</div>
                <div class="faq-answer"> - 输入文本：在文本框中输入或粘贴您希望提取关键词的文本。</div>
                <div class="faq-answer"> - 设置关键词数量：在“关键词数量”输入框中设置您希望提取的关键词个数（默认为5）。您可以根据需要调整该数值。</div>
                <div class="faq-answer"> - 点击“提取关键词”按钮：点击按钮后，系统将从文本中提取出最相关的关键词。</div>
                <div class="faq-answer"> - 查看结果：在页面下方，您将看到提取出的关键词列表。</div>
            </div>
        </div>

        <hr>

         <h3>情感分析功能</h3>
        <div class="faq">
            <div class="faq-item">
                <div class="faq-question"> 1. 目的</div>
                <div class="faq-answer">情感分析功能可以分析输入文本的情感倾向（如正面或负面），适用于评论、反馈等文本。</div>
            </div>
            <div class="faq-item">
                <div class="faq-question"> 2. 具体如何使用呢？</div>
                <div class="faq-answer"> - 输入文本：在文本框中输入或粘贴您希望进行情感分析的文本。</div>
                <div class="faq-answer"> - 点击“分析情感”按钮：点击按钮后，系统会对输入文本进行情感分析，并返回每个句子的情感结果。</div>
                <div class="faq-answer"> - 查看结果：系统将返回每个句子的情感倾向，包括正面和负面的概率。</div>
            </div>
        </div>

        <hr>

        <h2>操作步骤示例</h2>
        <div class="step-section">
            <div class="step-title">第一步：登录系统</div>
            <div class="step-content">
                <p>在浏览器中输入系统地址，点击“登录”按钮 ，输入您的用户名和密码进行登录。</p>
            </div>
        </div>
        <div class="step-section">
            <div class="step-title">第二步：进入分词页面</div>
            <div class="step-content">
                <p>登录后，根据分词需求，点击上面菜单栏中的各种分词功能，进入各个分词页面。</p>
            </div>
        </div>
        <div class="step-section">
            <div class="step-title">第三步：输入数据或中文文本</div>
            <div class="step-content">
                <p>在项目详情页，输入需要处理的数据或中文文本，点击“开始分析”或者“分词”按钮。</p>
            </div>
        </div>
        <h2>用户反馈</h2>
        <div class="feedback-form">
            <h3>您的反馈对我们很重要</h3>
            <form method="POST">
                {% csrf_token %}
                {{ form.as_p }}
                <button type="submit">提交反馈</button>
            </form>
        </div>

        {% if messages %}
            <div class="alert">
                {% for message in messages %}
                    <p>{{ message }}</p>
                {% endfor %}
            </div>
        {% endif %}
    </main>
</body>
</html>

<!--        <ul id="documentsList">-->
<!--            {% for document in documents %}-->
<!--                <li><a href="{{ document.url }}">{{ document.title }}</a></li>-->
<!--            {% endfor %}-->
<!--        </ul>-->

<!--        <div class="search-bar">-->
<!--            <h2>搜索帮助文档</h2>-->
<!--            <input type="text" id="searchInput" placeholder="输入关键词进行搜索..." onkeyup="filterDocuments()">-->
<!--        </div>-->
<!--        <hr>-->

<!--    <script>-->
<!--        function filterDocuments() {-->
<!--            const input = document.getElementById('searchInput');-->
<!--            const filter = input.value.toLowerCase();-->
<!--            const ul = document.getElementById('documentsList');-->
<!--            const li = ul.getElementsByTagName('li');-->

<!--            for (let i = 0; i < li.length; i++) {-->
<!--                const a = li[i].getElementsByTagName('a')[0];-->
<!--                if (a) {-->
<!--                    const txtValue = a.textContent || a.innerText;-->
<!--                    li[i].style.display = txtValue.toLowerCase().indexOf(filter) > -1 ? "" : "none";-->
<!--                }-->
<!--            }-->
<!--        }-->
<!--    </script>-->


